<template>
    <div>
        <!-- <div>{{ dealTime(0) }}</div>-->
        <!--  初始化进行中  -->
        <div v-if="['INIT_DATA', 'INIT_ENTRY'].includes(calculateEngineStateType)">
            <span>开始时间：</span>
            <span style="color: red; margin-right: 10px;">{{ startTime }}</span>
            <span>当前时间：</span>
            <span style="color: red; margin-right: 10px;">{{ currentTime }}</span>
            <span>耗时：</span>
            <span style="color: red;">{{ diffTimeStr }}</span>
        </div>
        <!--  初始化完 -->
        <div v-else-if="'INITIALIZED' === calculateEngineStateType">
            <span>开始时间：</span>
            <span style="color: red; margin-right: 10px;">{{ startTime }}</span>
            <span>完成时间：</span>
            <span style="color: red; margin-right: 10px;">{{ stopTime }}</span>
            <span>耗时：</span>
            <span style="color: red; margin-right: 10px;">{{ diffTimeStr }}</span>
            <span>条目总数/成功数/失败数/过滤数：</span>
            <span style="color: red; margin-right: 10px;">{{ statistical }}</span>
            <span>指令数量：</span>
            <span style="color: red;">{{ orderQuantity }}</span>
        </div>
    </div>
</template>

<script lang="ts">
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';

@Component({ name: 'RiskControlEngineTime' })
export default class RiskControlEngineTime extends Vue {
    beforeDestroy() {
        if (this.timeId) {
            clearInterval(this.timeId);
            this.timeId = null;
        }
    }
    // 开始、结束时间
    private startTime: any = '';
    private stopTime: any = '';
    // 耗时
    private diffTimeStr: any = '';
    // 条目总数/成功数/失败数/过滤数：
    private statistical: any = '';
    // 指令数量
    private orderQuantity: any = '';

    // 主动跳时间的定时器
    private timeId = null;
    // 当前时间
    private currentTime = '';
    // 消耗时间
    private diff = 0;

    @Prop() readonly processData!: any;
    @Prop() readonly calculateEngineStateType!: string;

    @Watch('processData', { immediate: true, deep: true })
    watchProcessData(value, oldValue) {
        if (JSON.stringify(value) !== JSON.stringify(oldValue)) {
            const processData = value;
            // 类型
            const calculateEngineStateType = processData.calculateEngineStateType;
            // 开始、结束时间
            const startTime: string = processData.startInitTime || '';
            const stopTime: string = processData.stopInitTime || '';
            // 耗时
            let diff;
            let diffTime;
            let diffTimeStr = '';
            if (calculateEngineStateType === 'INITIALIZED') {
                // 已完成  结束时间 - 开始时间
                diff = (new Date(stopTime) as any) - (new Date(startTime) as any);
            } else {
                // 未完成  当前时间 - 开始时间
                diff = (new Date() as any) - (new Date(startTime) as any);
            }
            diff = diff <= 0 ? 0 : diff; // 消耗时间小于 0 时，默认为 0
            diffTimeStr = this.dealTime(diff);
            // 条目总数/成功数/失败数/过滤数：
            let statistical = '';
            // 指令数量
            let orderQuantity = '';
            if (calculateEngineStateType === 'INITIALIZED') {
                const instructionEntryInitState = processData.instructionEntryInitState || {};

                const needInitEntryCodes = (instructionEntryInitState.needInitEntryCodes || []).length;
                const successInitEntryCodes = (instructionEntryInitState.successInitEntryCodes || []).length;
                const errorInitEntryCodes = (instructionEntryInitState.errorInitEntryCodes || []).length;
                const filterInitEntryCodes = (instructionEntryInitState.filterInitEntryCodes || []).length;
                statistical = `${needInitEntryCodes}/${successInitEntryCodes}/${errorInitEntryCodes}/${filterInitEntryCodes}`;

                orderQuantity = instructionEntryInitState.existsInstructionSize || 0;
            }

            this.startTime = startTime;
            this.stopTime = stopTime;
            this.diff = diff;
            this.diffTimeStr = diffTimeStr;
            this.statistical = statistical;
            this.orderQuantity = orderQuantity;

            // 如果在运行中，开启定时器
            if (['INIT_DATA', 'INIT_ENTRY'].includes(calculateEngineStateType)) {
                if (this.timeId) {
                    clearInterval(this.timeId);
                }
                this.timeId = setInterval(() => {
                    this.diff = this.diff + 1000;
                    this.diffTimeStr = this.dealTime(this.diff);
                    this.currentTime = this.$moment().format('YYYY-MM-DD HH:mm:ss');
                    if (diff <= 0) {
                        clearInterval(this.timeId);
                        this.timeId = null;
                    }
                }, 1000);
            } else {
                if (this.timeId) {
                    clearInterval(this.timeId);
                    this.timeId = null;
                }
            }
        }
    }
    dealTime(diff) {
        let diffTimeStr = '';
        const diffTime = this.$moment.duration(diff);
        const hours = diffTime.get('hours');
        const minutes = diffTime.get('minutes');
        const seconds = diffTime.get('seconds');
        if (hours) {
            diffTimeStr = `${hours} 时 ${minutes} 分 ${seconds} 秒`;
        } else if (minutes) {
            diffTimeStr = `${minutes} 分 ${seconds} 秒`;
        } else if (seconds) {
            diffTimeStr = `${seconds} 秒`;
        } else {
            diffTimeStr = '0 秒';
        }
        return diffTimeStr;
    }
}
</script>

<style lang="scss" scoped></style>
